<template>
    <div>
        <ul>
            <li v-for="item in orderPriceProd" :key="item.title">
                {{ item.title }}-{{ item.price }}元-{{ item.logo }}-{{
                    item.color
                }}
            </li>
        </ul>
        <van-button type="primary" @click="saveVuex">存储到购物车</van-button>
    </div>
</template>

<script>
import { mapState, mapGetters } from 'vuex';
export default {
    components: {},
    props: {},
    data() {
        return {};
    },
    computed: {
        ...mapState('shopCar', ['productList']),
        ...mapGetters('shopCar', ['orderPriceProd'])

        // renderProduct() {
        //     return this.productList.length > 0
        //         ? this.productList
        //         : JSON.parse(sessionStorage.getItem('productList'));
        // }
    },
    methods: {
        saveVuex() {
            console.log(this);
            this.$store.dispatch('shopCar/saveProd', {
                title: '鼠标',
                price: '299',
                logo: '雷蛇',
                color: '黑色'
            });
        }
    },

    created() {},
    mounted() {}
};
</script>
<style scoped></style>
